{% extends 'cms/base.html' %}
{% block title %}新闻分类{% endblock %}
{% block header %}
    <!-- DataTables -->
    <link rel="stylesheet" href="{% static 'adminLTE/plugins/datatables-bs4/css/dataTables.bootstrap4.css' %}">
{% endblock %}
{% block footer %}
    <!-- DataTables -->
    <script src="{% static 'adminLTE/plugins/datatables/jquery.dataTables.js' %}"></script>
    <script src="{% static 'adminLTE/plugins/datatables-bs4/js/dataTables.bootstrap4.js' %}"></script>
    <script>
        {#    $('#example2').DataTable({#}
        {#        "paging": true,#}
        {#        "lengthChange": true,#}
        {#        "searching": true,#}
        {#        "ordering": false,#}
        {#        "info": true,#}
        {#        "autoWidth": true,#}
        {#        "oLanguage": {#}
        {#            "sLengthMenu": "显示 _MENU_ 记录",#}
        {#            "sZeroRecords": "对不起，查询不到任何相关数据",#}
        {#            "sEmptyTable": "未有相关数据",#}
        {#            "sLoadingRecords": "正在加载数据-请等待...",#}
        {#            "sInfo": "当前显示 _START_ 到 _END_ 条，共 _TOTAL_ 条记录。",#}
        {#            "sInfoEmpty": "当前显示0到0条，共0条记录",#}
        {#            "sInfoFiltered": "（数据库中共为 _MAX_ 条记录）",#}
        {#            "sProcessing": "<img src='http://img.zcool.cn/community/011546554b9ab1000001bf729a84ca.jpg'/>",#}
        {#            "sSearch": "模糊查询：",#}
        {#            "sUrl": "",#}
        {#            //多语言配置文件，可将oLanguage的设置放在一个txt文件中，例：Javascript/datatable/dtCH.txt#}
        {#            "oPaginate": {#}
        {#                "sFirst": "首页",#}
        {#                "sPrevious": " 上一页 ",#}
        {#                "sNext": " 下一页 ",#}
        {#                "sLast": " 尾页 "#}
        {#            }#}
        {#        },#}
        {#    });#}
    </script>
    <script>
        $('#add-btn').click(function () {
            swal({
                title: '添加新分类',
                input: 'text',
                showCancelButton: true,
                confirmButtonText: '添加',
                cancelButtonText: '取消',
                reverseButtons: true,
                showLoaderOnConfirm: true,
                preConfirm: function (value) {
                    return new Promise(function (resolve, reject) {
                        if (!value.trim()) {
                            reject('请输入新分类~~');
                        } else {
                            setTimeout(function () { // setTime 模拟加载
                                return xfzajax.post({
                                    url: "/cms/news_category_add/",
                                    data: {
                                        name: value.trim(),
                                    },
                                    success: function (res) {
                                        if (res.code === 200) {
                                            resolve(res);
                                        } else {
                                            reject(res.message);
                                        }
                                    }
                                })
                            }, 2000);
                        }
                    });
                },
                allowOutsideClick: false
            }).then(function (res) {
                swal({
                    type: 'success',
                    title: res.message,
                    timer: 2000,
                    onClose: function () {
                        window.location.reload()
                    }
                });
            })
        })
        $('.edit-btn').click(function () {
            var pk = $(this).parents('tr').attr('data-pk')
            var oleName = $(this).parents('tr').attr('data-name')
            swal({
                type: 'question',
                title: '修改分类',
                text: oleName,
                input: 'text',
                showCancelButton: true,
                confirmButtonText: '添加',
                cancelButtonText: '取消',
                reverseButtons: true,
                showLoaderOnConfirm: true,
                preConfirm: function (value) {
                    return new Promise(function (resolve, reject) {
                        if (!value.trim()) {
                            reject('请输入新分类~~');
                        } else {
                            setTimeout(function () { // setTime 模拟加载
                                return xfzajax.post({
                                    url: "/cms/news_category_edit/",
                                    data: {
                                        name: value.trim(),
                                        pk: pk,
                                    },
                                    success: function (res) {
                                        if (res.code === 200) {
                                            resolve(res);
                                        } else {
                                            reject(res.message);
                                        }
                                    }
                                })
                            }, 2000);
                        }
                    });
                },
                allowOutsideClick: false
            }).then(function (res) {
                swal({
                    type: 'success',
                    title: res.message,
                    timer: 2000,
                    onClose: function () {
                        window.location.reload()
                    }
                });
            })
        })
        $('.del-btn').click(function () {
            var pk = $(this).parents('tr').attr('data-pk')
            var oleName = $(this).parents('tr').attr('data-name')
            swal({
                type: 'warning',
                title: '删除分类',
                text: oleName,
                showCancelButton: true,
                confirmButtonText: '删除',
                cancelButtonText: '取消',
                reverseButtons: true,
                showLoaderOnConfirm: true,
                preConfirm: function (value) {
                    return new Promise(function (resolve, reject) {
                        setTimeout(function () { // setTime 模拟加载
                            return xfzajax.post({
                                url: "/cms/news_category_del/",
                                data: {
                                    pk: pk,
                                },
                                success: function (res) {
                                    if (res.code === 200) {
                                        resolve(res);
                                    } else {
                                        reject(res.message);
                                    }
                                }
                            })
                        }, 2000);
                    });
                },
                allowOutsideClick: false
            }).then(function (res) {
                swal({
                    type: 'success',
                    title: res.message,
                    timer: 2000,
                    onClose: function () {
                        window.location.reload()
                    }
                });
            })
        })
    </script>

{% endblock %}
{% block content-header %}
    新闻分类
{% endblock %}
{% block content %}
    <div class="row">
        <div class="col-lg-12">
            <div class="card card-primary card-outline">
                <div class="card-header">
                    <button class="btn btn-info float-right" id="add-btn">添加分类</button>
                </div>
                <div class="card-body">
                    <table id="example2" class="table table-hover dataTable">
                        <thead>
                        <tr>
                            <th>分类名</th>
                            <th>新闻数量</th>
                            <th>操作</th>
                        </tr>
                        </thead>
                        <body>
                        {% for category in categories %}
                            <tr data-pk="{{ category.id }}" data-name="{{ category.name }}">
                                <td>{{ category.name }}</td>
                                <td>20</td>
                                <td>
                                    <button class="btn btn-warning btn-xs edit-btn">编辑</button>
                                    <button class="btn btn-danger btn-xs del-btn">删除</button>
                                </td>
                            </tr>
                        {% endfor %}

                        </body>
                    </table>
                </div>
            </div>
        </div>
    </div>

{% endblock %}